<template>
<div>
	<el-button type="danger"
		@click="GeneratePdf(htmlTitle)">
		导出PDF
	</el-button>
  <div  id="PdfBox">
    <table id="pdfGen" align="center" width="900" >
    	<p align="center" style="font-size:40px;">辽东学院教育教学改革与研究项目</p>
    	<h2 align="center" style="font-size: 80px;"><strong>申   请   表 </strong></h2>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<table width="60%" height="276" border="0" align="center" cellpadding="0" cellspacing="0" bordercolor="#000000">
    		<tr>
    			<td><p class="firstPageLabel">项目名称：</p></td>
    			<td><p class="firstPageName">{{project.proName}}</p></td>
    		</tr>
    		<tr>
    			<td><p class="firstPageLabel">项目主持人：</p></td>
    			<td><p class="firstPageName" v-for="(item,index) in members" v-if="index==0">{{item.memberName}}</p></td>
    		</tr>
    		<tr>
    			<td><p class="firstPageLabel">所属类别：</p></td>
    			<td>
            <p
            class="firstPageName"
            v-for="(item,index) in levelIdMap"
            v-if="index==project.levelId"
            >{{item.value}}</p>
          </td>
    		</tr>
    		<tr>
    			<td><p class="firstPageLabel">所在单位：</p></td>
    			<td><p class="firstPageName">{{project.proDepartment}}</p></td>
    		</tr>
    		<tr>
    			<td><p class="firstPageLabel">电话：</p></td>
    			<td><p class="firstPageName">(办){{project.proTelephone}}(手机){{project.proPhone}}</p></td>
    		</tr>
    		<tr>
    			<td><p class="firstPageLabel">E-mail：</p></td>
    			<td><p class="firstPageName">{{project.proEmail}}</p></td>
    		</tr>
    		<tr>
    			<td><p class="firstPageLabel">填表日期：</p></td>
    			<td><p class="firstPageName">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;年&nbsp;&nbsp;&nbsp;&nbsp;月&nbsp;&nbsp;&nbsp;&nbsp;日</p></td>
    		</tr>
    	</table>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center" style="font-size: 25px;letter-spacing: 5px;">辽东学院教务处</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p align="center">&nbsp;</p>
    	<p>&nbsp;</p>
      <div class="infoDiv">
        <p align="left" class="secondTitle">一 、基本情况 </p>
        <table width="100%" height="100%" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#000000" >
        	<tr>
        		<td colspan="2" align="center" valign="middle">项目名称</td>
        		<td colspan="11" align="center" valign="middle">{{project.proName}}</td>
        	</tr>
        	<tr>
        		<td colspan="2" align="center" valign="middle">所属类别</td>
        		<td colspan="11" align="center" valign="middle"
            v-for="(item,index) in levelIdMap"
            v-if="index==project.levelId"
            >{{item.value}}</td>
        	</tr>
        	<tr>
        		<td colspan="2" align="center" valign="middle">起止年月</td>
        		<td colspan="11" align="center" valign="middle">{{project.proStartdate}}至{{project.proEnddate}}</td>
        	</tr>
        	<tr>
        		<td width="19" rowspan="13" align="center" valign="middle">
            <p>项</p>
        		<p>目</p>
        		<p>主</p>
        		<p>持</p>
        		<p>人</p></td>
        		<td width="65" align="center" valign="middle">姓 名</td>
        		<td colspan="3" align="center" valign="middle" v-for="(item,index) in  members"v-if="index==0">{{item.memberName}}</td>
        		<td width="36" align="center" valign="middle">性<br />
        		别</td>
        		<td width="28" align="center" valign="middle">{{Sex}}</td>
        		<td width="49" align="center" valign="middle">职称</td>
        		<td width="69" align="center" valign="middle"
            v-for="(item,index) in  members"v-if="index==0"
            >{{item.memberTitle}}</td>
        		<td width="45" align="center" valign="middle">现 任职 务</td>
        		<td colspan="3" align="center" valign="middle"
            v-for="(item,index) in  members"v-if="index==0"
            >{{item.memberJob}}</td>
        	</tr>
        	<tr>
        		<td rowspan="6" align="center" valign="middle"><p align="center">主要教学工作简历 </p></td>
        		<td colspan="4" align="center" valign="middle">时间</td>
        		<td colspan="3" align="center" valign="middle">课程名称</td>
        		<td align="center" valign="middle">授 课对 象</td>
        		<td width="30" align="center" valign="middle">学时</td>
        		<td colspan="2" align="center" valign="middle">所在单位</td>
        	</tr>
        	<tr v-for="rAD in teachings">
        		<td colspan="4" align="center" valign="middle">{{rAD.teachingDate.substr(0, 7)}}至<br />{{rAD.teachingDate.substr(9)}}</td>
        		<td colspan="3" align="center" valign="middle">{{rAD.teachingCoursename}}</td>
        		<td align="center" valign="middle">{{rAD.teachingPrelectobject}}</td>
        		<td align="center" valign="middle">{{rAD.teachingLearnhour}}</td>
        		<td colspan="2" align="center" valign="middle">{{rAD.teachingDepartment}}</td>
        	</tr>
        	<tr v-for="rowNumber in 5 - teachings.length">
        		<td colspan="4" align="center" valign="middle">&nbsp;</td>
        		<td colspan="3" align="center" valign="middle">&nbsp;</td>
        		<td align="center" valign="middle">&nbsp;</td>
        		<td align="center" valign="middle">&nbsp;</td>
        		<td colspan="2" align="center" valign="middle">&nbsp;</td>
        	</tr>
        	<tr>
        		<td rowspan="6" align="center" valign="middle"><p align="center">主要科学研究和教学研究工作简历</p></td>
        		<td colspan="4" align="center" valign="middle">时间</td>
        		<td colspan="2" align="center" valign="middle">项目名称</td>
        		<td align="center" valign="middle">项目来源</td>
        		<td colspan="3" align="center" valign="middle">主要鉴定意见</td>
        		<td width="64" align="center" valign="middle">获奖情况</td>
        	</tr>
        	<tr v-for="rRAD in searchings">
        		<td colspan="4" align="center" valign="middle">{{rRAD.searchingDate.substr(0, 7)}}至<br />{{rRAD.searchingDate.substr(9)}}</td>
        		<td colspan="2" align="center" valign="middle">{{rRAD.searchingName}}</td>
        		<td align="center" valign="middle">{{rRAD.searchingSource}}</td>
        		<td colspan="3" align="center" valign="middle">&nbsp;</td>
        		<td align="center" valign="middle">{{rRAD.searchingAwards}}</td>
        	</tr>
        	<tr v-for="rowNumber in 5 - searchings.length">
        		<td colspan="4" align="center" valign="middle">&nbsp;</td>
        		<td colspan="2" align="center" valign="middle">&nbsp;</td>
        		<td align="center" valign="middle">&nbsp;</td>
        		<td colspan="3" align="center" valign="middle">&nbsp;</td>
        		<td align="center" valign="middle">&nbsp;</td>
        	</tr>
        	<tr>
        		<td rowspan="6" align="center" valign="middle">项<br />
        		目<br />
        		组<br />
        		主<br />
        		要<br />
        		成<br />
        		员</td>
        		<td align="center" valign="middle">姓名</td>
        		<td width="51" align="center" valign="middle">年龄</td>
        		<td colspan="4" align="center" valign="middle">专业技<br />
        		术职称</td>
        		<td align="center" valign="middle">职务</td>
        		<td align="center" valign="middle">所在部门</td>
        		<td colspan="2" align="center" valign="middle">主要教学<br />
        	科研领域</td>
        		<td width="60" align="center" valign="middle">项目中<br />
        	的分工</td>
        		<td align="center" valign="middle">签字</td>
        	</tr>
        	<tr v-for="mMA in members">
        		<td align="center" valign="middle">{{mMA.memberName}}</td>
        		<td colspan="2" align="center" valign="middle">{{getAge(mMA.idcard)}}</td>
        		<td colspan="3" align="center" valign="middle">{{mMA.memberTitle}}</td>
        		<td align="center" valign="middle">{{mMA.memberJob}}</td>
        		<td align="center" valign="middle">{{mMA.memberDep}}</td>
        		<td colspan="2" align="center" valign="middle">{{mMA.memberResearchareas}}</td>
        		<td align="center" valign="middle">{{mMA.memberDivision}}</td>
        		<td align="center" valign="middle"><img :src="'/img' + mMA.memberSignature.substr(6)" width="80"/></td>
        	</tr>
        	<tr v-for="rowNumber in 5 - members.length">
        		<td align="center" valign="middle">&nbsp;</td>
        		<td colspan="2" align="center" valign="middle">&nbsp;</td>
        		<td colspan="3" align="center" valign="middle">&nbsp;</td>
        		<td align="center" valign="middle">&nbsp;</td>
        		<td align="center" valign="middle">&nbsp;</td>
        		<td colspan="2" align="center" valign="middle">&nbsp;</td>
        		<td align="center" valign="middle">&nbsp;</td>
        		<td align="center" valign="middle">&nbsp;</td>
        	</tr>
        </table>
      </div>
      <div class="infoDiv">
        <p align="left" class="secondTitle">二、项目的立项依据和目标 </p>
        <table width="100%" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#000000">
        	<tr>
        		<td width="566" height="100" align="left" valign="top">1．本项目的现状与存在问题分析（不少于500字） <br />
        		<p><span v-html="project.proAnalysis"></span></p>
        		</td>
        	</tr>
        	<tr>
        		<td height="102" align="left" valign="top">2．本项目的改革研究内容、主要特色和要解决的关键问题（不少于2000字）
        		<p><span v-html="project.proProblem"></span></p>
        		</td>
        	</tr>
        	<tr>
        		<td height="104" align="left" valign="top">3．本项目改革研究的预期成果（不少于500字）
        		<p><span v-html="project.proExpection"></span></p>
        		</td>
        	</tr>
        	<tr>
        		<td height="104" align="left" valign="top">4．本项目的改革研究的总体安排及进度（不少于500字）
        		<p><span v-html="project.proArrange"></span></p>
        		</td>
        	</tr>
        	<tr>
        		<td height="122" align="left" valign="top">5．已有的工作基础、条件及前期已有工作成果（不少于500字）
        		<p><span v-html="project.proResults"></span></p>
        		</td>
        	</tr>
        </table>
      </div>
    		<br />
        <div class="infoDiv">
          <p align="left" class="secondTitle">三、所在单位教学工作委员会意见 </p>
          <table width="100%" align="center" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000">
          	<tr>
          		<td align="left">
              <span v-html="project.proCommittee"></span>
              <p>&nbsp;</p>
          		<p>&nbsp;</p>
          		<p>&nbsp;</p>
          		<p>&nbsp;</p>
          		<p align="right">签    章 &nbsp;&nbsp;</p>
              </td>
          	</tr>
          	</table>
        </div>

        <div class="infoDiv">
          <p align="left" class="secondTitle">四、专家组评审意见（重点项目填写） </p>
          <table width="100%" align="center" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000">
          	<tr>
          		<td align="left">
               <span v-html="project.proExperts"></span>
              <p>&nbsp;</p>
          		<p>&nbsp;</p>
          		<p>&nbsp;</p>
          		<p>&nbsp;</p>
          		<p align="right">签    章 &nbsp;&nbsp;</p>
              </td>
          	</tr>
          	</table>
        </div>

        <div class="infoDiv">
          <p align="left" class="secondTitle">五、学校审批意见 </p>
           <table width="100%" align="center" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000">
           	<tr>
           		<td align="left">
              <span v-html="project.proSchool"></span>
              <p>&nbsp;</p>
           		<p>&nbsp;</p>
           		<p>&nbsp;</p>
           		<p>&nbsp;</p>
           		<p align="right">签    章 &nbsp;&nbsp;</p>
              </td>
           	</tr>
           </table>
        </div>

    </table>
  </div>

</div>
</template>

<script>
export default {
	created() {
		this.getProjectInfo()
	},
	data () {
		return {
			proId: '',
			Sex: '',
			project: [],
			members: [],
			searchings: [],
			teachings: [],
			levelIdMap: [{
				value: 'NULL',
			}, {
				value: '一般项目',
			}, {
				value: '课程思政专项',
			}, {
				value: '重点项目',
			}, {
				value: '一般项目',
			}, {
				value: '重点项目',
			}, {
				value: '委托项目',
			}, {
				value: '招标项目',
			}, {
				value: '课程层面',
			}, {
				value: '专业层面',
			}, {
				value: '学校层面',
			}, {
				value: '课程层面',
			}, {
				value: '专业层面',
			}, {
				value: '学校层面',
			}],
		}
	},
	methods: {
		getProjectInfo() {
			this.proId = this.$route.query.pro_id;
			this.$api.project.getProjectById({
				proId: this.proId,
			}).then((response)=>{
        console.log(response)
				this.project = response.data.data.project;
				this.members = response.data.data.members;
				this.searchings = response.data.data.searchings;
				this.teachings = response.data.data.teachings;
				this.getSex();
			})
		},
		getAge(UUserCard) {
			let myDate = new Date();
			let month = myDate.getMonth() + 1;
			let day = myDate.getDate();
			let age = myDate.getFullYear() - UUserCard.substring(6, 10) - 1;
			if (UUserCard.substring(10, 12) < month || UUserCard.substring(10, 12) == month && UUserCard.substring(12, 14) <= day) {
				age++;
			}
			return age;
		},
		getSex() {
			if (parseInt(this.members[0].idcard.substr(16, 1)) % 2 == 1) {
				this.Sex = "男"
			} else {
				this.Sex = "女"
			}
		},
	}
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  #PdfBox{
    margin: 0 auto;
    border: 1px solid #000000;
    width: 900px;
    padding: 10px;
  }
  .infoDiv{
    padding:50px;
  }
  .secondTitle{
    font-size: 25px;
  }
  .firstPageLabel{
    margin: 0;
    font: "楷体";
    font-size: 15px;
    font-weight: 600;
    letter-spacing:5px;
  }
  .firstPageName{
    text-align: center;
    margin: 0;
    font-size: 18px;
    letter-spacing:5px;
    border-bottom: 1px solid #000000;
  }
</style>
